<template>
  <div class="record" v-if="albumList">
    <ul>
      <li class="remarks">
        <div class="flex2">
          <p>专辑</p>
        </div>
        <div>
          <p>作者</p>
        </div>
        <div class="cen">
          <p>歌曲数</p>
        </div>
      </li>
      <li v-for="(val,index) in albumList" :key="index">
        <album :infoList='val'/>
      </li>
    </ul>
  </div>
</template>

<script>
import require from "requests/getSong";
import album from "components/business/album";
export default {
  name: "record",
  data(){
    return {
      albumList:null
    }
  },
  components: {
    album
  },
  methods:{
    getalbum() {
      require.loveAlbum().then(res => {
        this.albumList=res.data.data
      });
    },
  },
  mounted(){
    this.getalbum()
  }
};
</script>

<style scoped lang='less'>
.record {
  ul {
    li {
      margin: 8px 0;
    }
  }
  .remarks {
    display: flex;
    div {
      flex: 1;
      color: #999;
    }
    .flex2 {
      flex: 2;
    }
    .cen {
      p {
        text-align: center;
      }
    }
  }
}
</style>